<template>
  <a-layout-sider
    :class="['sider', theme ]"
    width="200px"
    :collapsible="collapsible"
    :trigger="null">
<!--    <logo />-->
    <menuButton>
    </menuButton>
      <!--<s-menu-->
        <!--:collapsed="collapsed"-->
        <!--:menu="menus"-->
        <!--:theme="theme"-->
        <!--@select="onSelect"-->
        <!--mode="vertical"  v-model="current"-->
        <!--style="padding: 0;" type="primary" v-popover="popover"></s-menu>-->

  </a-layout-sider>

</template>

<script>
  import ALayoutSider from "ant-design-vue/es/layout/Sider"
  import Logo from '../tools/Logo'
  import SMenu from './index'
  import menuButton from '@/views/mapping/Menubutton'

  export default {
    name: "SideMenu",
    components: { ALayoutSider, Logo, SMenu,menuButton,},
    props: {
      mode: {
        type: String,
        required: false,
        default: 'inline'
      },
      theme: {
        type: String,
        required: false,
        default: 'dark'
      },
      collapsible: {
        type: Boolean,
        required: false,
        default: false
      },
      collapsed: {
        type: Boolean,
        required: false,
        default: false
      },
      menus: {
        type: Array,
        required: true
      }
    },
    methods: {
      onSelect (obj) {
        this.$emit('menuSelect', obj)
      },
      handleClick (e) {
        console.log('click ', e)
      },
    }
  }
</script>
